<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>点击</button>
</body>
<script>
// 设计模式
// 单例模式
// let obj = {
//     name:"张三",
//     age:20
// }

// 单例模式
// class Person{
//     static instance;
//     constructor(name){
//         if(Person.instance){
//             return Person.instance;
//         }
//         Person.instance = this;
//         this.name = name;
//     }
// }
// // class Animal{
// //     static instance;
// //     constructor(name){
// //         if(Animal.instance){
// //             return Animal.instance;
// //         }
// //         Animal.instance = this;
// //         this.name = name;
// //     }
// // }
// let zhangsan = new Person("张三");
// let lisi  = new Person("李四");
// console.log(lisi,zhangsan);

// 通用单例函数；
// class Person{
//     constructor(name){
//         this.name = name;
//     }
// }

// class Animal{
//     constructor(name){
//         this.name = name;
//     }
// }


// 高阶函数： 有函数输入或者是输出的函数  
function getSingle(fn){
    let instance;
    return function(...args){
        if(!instance){
            instance = new fn(...args);
        }
        return instance;
    }
}
// let SPerson = getSingle(Person);
// let zhangsan = new SPerson("张三");
// let lisi  = new SPerson("李四");
// console.log(lisi,zhangsan);

// 应用 ：window 、document、store、$()....
// 对话框 只能有一个。

class CreateDialog{
    constructor(){
        this.div = document.createElement("div");
        this.div.innerHTML = "对话框";
        this.div.style.display = "none";
        document.body.appendChild(this.div);
    }
    showDialog(){
        this.div.style.display = "block";
    }
}

let SCreateDialog = getSingle(CreateDialog);
let dialog = new SCreateDialog();
// let dialog2 = new SCreateDialog();
document.querySelector("button").onclick = function(){
    dialog.showDialog();
    dialog2.showDialog();
}



// function test(){
//     console.log("test");
// }
// // test();
// new test;



</script>
</html>